input[type=textarea], select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    height: 6em;
    vertical-align: text-top;
}

input[type=text], select {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

input[type=email], select {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

input[type=hidden], select {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

input[type=submit] {
  width: 100%;
  background-color: #ccc;
  color: black;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}

div {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}



.collapsible {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .collapsible:hover {
  background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.content {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  background-color: ffffff;
}



.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline-style: solid;
  outline-width: thin;
  transition: 0.4s;
}

.active, .accordion:hover {
  background-color: #ccc; 
}

.panel {
  padding: 0 18px;
  display: none;
  background-color: white;
  width: 100%;
  overflow: hidden;
}

.centerTable {
  margin-left: auto;
  margin-right: auto;
}

pre {
  overflow-x: auto;
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word;
  font-family: Arial;
  font-size: 15px;
}



h1 {
  text-align: center;
  font-family: Arial;
}

h2 {
  text-align: center;
  font-family: Arial;
}

h3 {
  text-align: center;
  font-family: Arial;
}

h4 {
  font-family: Arial;
}


.footer {
  font-family: Arial;
  font-size: 10px;
}


.indexheader {
  font-family: Arial;
  font-size: 30px;
  text-align: center;
}
.indextext {
  font-family: Arial;
  font-size: 15px;
  text-align: center;
}
.indexlist {
  font-family: Arial;
  font-size: 15px;
}
.indexURL {
  font-family: Arial;
  font-size: 15px;
}

.photographerpage {
  font-family: Arial;
}

.photographerrawdata {
  font-family: courier;
}


table.roundedCorners { 
  border: 1px solid LightGrey;
  border-radius: 13px; 
  border-spacing: 0;
  }
table.roundedCorners td, 
table.roundedCorners th { 
  border-bottom: 1px solid LightGrey;
  padding: 10px; 
  }
table.roundedCorners tr:last-child > td {
  border-bottom: none;
}

td.rowData{
  color:#696969;
}

.customColorText {
    font-family: Arial;
    color: red;
    font-size: 20px;
}